<template>
  <div style="width:100%;height:100vh;background:#f5f5f5;">
    <mt-header title="版本" style="background:#fff;color:#000;">
      <router-link to="/" slot="left">
        <mt-button icon="back"></mt-button>
      </router-link>
    </mt-header>
    <div class="top">
      <div class="top-lt">
        版本任务
      </div>
      <div class="top-rt">
        当前版本10.18
      </div>
    </div>
    <div class="tips">
      已是最新版本
    </div>
    <div class="top">
      <div class="top-lt">
        已下载
      </div>
    </div>
    <div class="foot">
      <div class="foot-lt">
        版本10.18
      </div>
      <div class="foot-rt">
        删除
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    methods: {

    }
  };
</script>

<style scoped>
  .foot{
    margin: .3rem;
    background-color: #fff;
    border-radius: .2rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: .4rem .5rem;
  }
  .foot-lt{
    font-size: 28px;
    color: #333;
    font-weight: 600;
  }
  .foot-rt{
    width: 1.15rem;
    height: .58rem;
    background-color: #F46C6C;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size:24px;
    border-radius: .1rem;
  }
  .top {
    height: 1rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #B6B6B6;
    padding: 0 .3rem;
    font-size: 35px;
    color: #fff;
  }

  .tips {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size:28px;
    color: #D31217;
    padding: .75rem 0;
  }
  .top-lt{
    font-size:28px;
    color: #fff;
  }
  .top-rt{
    font-size: 28px;
    color: #fff;
  }
</style>
